<template>
	<view style="background-color: #F4F5F7;">
		<uni-nav-bar title="个人信息" left-icon="left" @clickLeft="back" :border="false" :fixed="true"
			background-color="#FFFFFF" :statusBar="true">
		</uni-nav-bar>
	</view>
	<view>
		<view @click="upload"
			style="height: 60px; width: 90%;background-color: #F2F2F2;margin: 60px auto 0; display: flex;align-items: center; justify-content: space-between;">
			<text style="margin-left: 10px;">头像</text>
			<view style="display: flex;">
				<up-avatar @click="clickAvatar" :src="image" size="20"
					style="box-shadow: 0 0 0 2px white;margin-right: 10px;"></up-avatar>
				<u-icon name="arrow-right" style="margin-right: 10px;"></u-icon>
			</view>
		</view>
		<view
			style="height: 60px; width: 90%;background-color: #F2F2F2;margin: 10px auto; display: flex;align-items: center; justify-content: space-between;">
			<text style="margin-left: 10px;">昵称</text>
			<!-- <text style="margin-right: 15px;">12313</text> -->
			<view style="position: relative;right: 10px; overflow: hidden;">
				<u-input v-model="nickname" border="none" name="nickname" inputAlign="right" style="width: 80px;" placeholder="请输入昵称"
					maxlength="10" value="123"></u-input>
			</view>
		</view>
		<view @click="sexShow = true"
			style="height: 60px; width: 90%;background-color: #F2F2F2;margin: 10px auto; display: flex;align-items: center; justify-content: space-between;">
			<text style="margin-left: 10px;">性别</text>
			<view style="display: flex;">
				<text style="margin-right: 10px;">{{this.sex}}</text>
				<u-picker :show="sexShow" :columns="columns" @confirm="confirm" @cancel="cancel"></u-picker>
				<u-icon name="arrow-right" style="margin-right: 10px;"></u-icon>
			</view>
		</view>
		<!-- <view @click="dateShow = true"
			style="height: 60px; width: 90%;background-color: #F2F2F2;margin: 10px auto; display: flex;align-items: center; justify-content: space-between;">
			<text style="margin-left: 10px;">年龄</text>
			<view style="display: flex;">
				<text>{{date}}</text>
				<u-datetime-picker :show="dateShow" v-model="value1" mode="date" @cancel="dateClose"
					@confirm="dateConfirm"></u-datetime-picker>
				<u-icon name="arrow-right" style="margin-right: 10px;"></u-icon>
			</view>
		</view> -->
		<up-button type="primary" shape="circle" text="保存" style="width: 90%;" @click="subMsg"></up-button>
	</view>
</template>

<script>
	import {
		updateUserInfo
	} from "../../request/API/updateUserInfo";
	export default {
		data() {
			return {
				username: '',
				image: "",
				sexShow: false,
				fileList1: [],
				dateShow: false,
				value1: Number(new Date()),
				sex: "男",
				date: "",
				columns: [
					['男', '女']
				],
			}
		},
		onLoad(options) {
			// 从options中获取传递的参数
			const nickname = options.nickname;
			const avatar = options.avatar;
			const sex = options.sex;
			this.image = avatar
			this.nickname = nickname
			this.sex = sex
			// console.log(nickname)
			// 在这里可以对获取到的参数进行处理
		},
		methods: {
			subMsg() {
				const nickname = this.nickname
				const avatar = this.image
				const sex = this.sex
				updateUserInfo({
						nickname,
						avatar,
						sex
					})
					.then(data => {
						uni.showToast({
							title: data.msg,
							icon: 'none',
						});
					})
					.catch(error => {

					});
				// const date = this.date
				console.log(nickname, avatar, sex)
			},
			back() {
				uni.redirectTo({
					url: "/pages/home/home?nickname=" + this.nickname + "&avatar=" + this.image
				})
			},
			upload() {
				const token = uni.getStorageSync('token');
				uni.chooseImage({
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths;
						console.log(tempFilePaths)
						uni.uploadFile({
							url: 'http://uni.gaowa.love/api/work/upload', // 替换为您的上传接口地址
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								'user': 'test'
							},
							header: {
								Authorization: token['token'] // 在请求头中添加 token
							},
							success: (uploadFileRes) => {
								console.log(uploadFileRes.data);
								let dataObj = JSON.parse(uploadFileRes.data);
								// 提取 JSON 对象中的 URL 地址部分
								this.image = dataObj.data
								uni.showToast({
									title: dataObj.msg,
									icon: 'none',
								});
								// 在这里可以保存用户信息和上传后的图片信息
								// 例如，可以将上传后的图片链接保存到数据库中
							}
						});
					}
				});
			},
			confirm(e) {
				this.sexShow = false
				this.sex = e.value[0]
				console.log(e.value[0])
			},
			cancel() {
				this.sexShow = false
			},
			dateConfirm(e) {
				let date = new Date(e.value);
				let year = date.getFullYear();
				let month = date.getMonth() + 1; // 月份是从0开始的，需要加1
				let day = date.getDate();
				// console.log(`${year}-${month}-${day}`);
				this.date = `${year}-${month}-${day}`
				this.dateShow = false
			},
		}
	}
</script>

<style>
</style>